$(function () {
    //1.变量抽取
    var role_datagrid = $("#role_datagrid");
    var role_dialog = $("#role_dialog");
    var role_form = $("#role_form");
    var menu_combotree = $("#menu_combotree");

    var allPermissions = $("#allPermissions");
    var selfPermissions = $("#selfPermissions");

    role_datagrid.datagrid({
        fit: true,
        url: '/role/getAll.do',
        columns: [[
            {field: 'sn', title: '角色编号', width: 100},
            {field: 'name', title: '角色名称', width: 100}
        ]],
        toolbar: '#tb',
        //列自适应
        fitColumns: true,
        //行号
        rownumbers: true,
        //允许单线
        singleSelect: true
    })

    menu_combotree.combotree({
        onCheck: function (node, checked) {
            if (checked) {
                //获取树形对象
                var treeObj = menu_combotree.combotree('tree');
                //获取当前节点的根菜单
                var parent = treeObj.tree('getParent', node.target);
                if (parent) {
                    //勾选根菜单
                    treeObj.tree('check', parent.target);
                }
            }
        }

    })

    role_dialog.dialog({
        width: 620,
        height: 460,
        buttons: '#form_btn',
        closed: true,
        onClose: function () {
            role_form.form('clear');
            //清空已有权限的数据
            selfPermissions.datagrid('loadData', []);
            //重新加载所有权限的数据
            allPermissions.datagrid('load');
        }
    })


    //2.把方法统一放到一个对象中进行管理
    var methodObj = {
        add: function () {
            role_dialog.dialog('setTitle', '新增角色');
            role_dialog.dialog('open');
        },
        edit: function () {
            var row = role_datagrid.datagrid('getSelected');
            if (!row) {
                $.messager.alert('温馨提示', '请选中一条数据!', 'warning');
                return;
            }
            //回显权限集合数据
            selfPermissions.datagrid('load', {roleId: row.id});

            $.get('/role/getMenuIdByRoleId.do', {roleId: row.id}, function (data) {
                //回显菜单数据
                menu_combotree.combotree('setValues', data);
            });

            //回显表单
            role_form.form('load', row);

            role_dialog.dialog('setTitle', '编辑角色');
            role_dialog.dialog('open');
        },
        reload: function () {
            role_datagrid.datagrid('reload');
        },
        save: function () {
            role_form.form('submit', {
                url: '/role/saveOrUpdate.do',
                onSubmit: function (param) {
                    //获取已有权限中里面的所有数据
                    var rows = selfPermissions.datagrid('getRows');
                    for (var i = 0; i < rows.length; i++) {
                        //提交额外的参数
                        param['permissions[' + i + '].id'] = rows[i].id;
                    }
                    //获取菜单选中的所有数据
                    var menus = menu_combotree.combotree('getValues');
                    for (var i = 0; i < menus.length; i++) {
                        //提交额外的参数
                        param['menus[' + i + '].id'] = menus[i];
                    }
                },
                success: function (data) {
                    data = $.parseJSON(data);
                    if (data.success) {
                        $.messager.alert('温馨提示', '保存成功！', 'info', function () {
                            methodObj.cancel();
                            role_datagrid.datagrid('reload');
                        });
                    } else {
                        $.messager.alert('温馨提示', data.msg, 'warning');
                    }
                }
            })
        },
        cancel: function () {
            role_dialog.dialog('close');
        }

    }

    //3.给按钮统一绑定点击事件
    $("a[data-cmd]").click(function () {
        //获取按钮的data-cmd的属性值
        var methodName = $(this).data('cmd');
        methodObj[methodName]();
    })

    allPermissions.datagrid({
        title: '所有权限',
        height: 320,
        fitColumns: true,
        rownumbers: true,
        url: '/permission/getAll.do',
        columns: [[
            {field: 'name', title: '权限名称', width: 100, align: 'center'},
        ]],
        onClickRow: function (index, row) {
            //把选中的数据添加到已有权限中
            selfPermissions.datagrid('appendRow', row);
            //把该数据从所有权限移除掉
            allPermissions.datagrid('deleteRow', index);
        }
    })



    selfPermissions.datagrid({
        title: '已有权限',
        height: 320,
        url: '/permission/selectByRoleId.do',
        fitColumns: true,
        rownumbers: true,
        columns: [[
            {field: 'name', title: '权限名称', width: 100, align: 'center'},
        ]],
        onClickRow: function (index, row) {
            allPermissions.datagrid('appendRow', row);
            selfPermissions.datagrid('deleteRow', index);
        },
        onLoadSuccess: function (data) {
            //1.把已有权限中的数据取出来,把id全部放到一个ids数组中
            var ids = $.map(data.rows, function (p) {
                return p.id;
            })
            //2.获取所有权限中的数据,遍历该集合
            var rows = allPermissions.datagrid('getRows');
            //3.取出来每一个权限
            for (var i = rows.length - 1; i >= 0; i--) {
                var permission = rows[i];
                //判断是否存在ids数组中,如果存在就需要从所有权限中移除掉
                var index = $.inArray(permission.id, ids);
                if (index >= 0) {
                    allPermissions.datagrid('deleteRow', i);
                }
            }
        }
    })
})
